/*Credit for the responsive SGG goes to Eldon: http://elvisitacion.blogspot.com/2012/04/4000-lines-of-divs-on-wall.html  */

table {
    width: 100%;
}

.get-started, .activity, .event, .excursion, .commitment {
    border: 1px solid;
    border-radius: 8px 8px 8px 8px;
    min-height: 70px;
    min-width: 20px;
    word-wrap: break-word;
}

.gridTable td {
    font-size: 11px;
    width: 11%;
}

.gridTable h5, .gridTable h3 {
    color: black;
}

.title {
    min-height: 90px;
}

@media(max-width: 440px){
    .container-fluid {
        padding: 0px;
    }
    
    .vertical { 
        margin-top: 4px;
        writing-mode:tb-rl;
        -webkit-transform:rotate(90deg);
        -moz-transform:rotate(90deg);
        -o-transform: rotate(90deg);
        white-space:nowrap;
        display:block;
        bottom:0; 
        height:20px; 
    }

    td,tr,th { 
        border-collapse: collapse;
        border-spacing: 0; 
    }
    
    .gridTable h3 {
        font-size: 12pt;
    }
    
    .get-started, .activity, .event, .excursion, .commitment {
        margin: 0px;
        font-size: 5pt;
        border: 1px solid;
        border-radius: 8px 8px 8px 8px;
        height: 70px;
        width: 27px;
        word-wrap: break-word;
    }
}

.activity-legend, .commitment-legend, .event-legend, .survey-legend, .excursion-legend {
    border: 1px solid #000000;
    border-radius: 4px 4px 4px 4px;
    height: 12px;
    width: 12px;
}